<!-- 台账详情 -->
<template>
	<view class="detail-box">
		<view class="text-card">
			<view class="card-title"><text>台账详情</text></view>
			<view class="flex-box">
				<view class="flex-box flex-w">
					<view class="label"><text>车牌号</text></view>
					<view class="con flex-w">
						<text>{{info.vehCode}}</text>
					</view>
				</view>
				<view class="flex-box flex-w">
					<view class="label"><text>挂车牌号</text></view>
					<view class="con flex-w">
						<text>{{info.trailerNo}}</text>
					</view>
				</view>
			</view>
			<view class="flex-box">
				<view class="flex-box flex-w">
					<view class="label"><text>驾驶员</text></view>
					<view class="con flex-w">
						<text>{{info.driverName}}</text>
					</view>
				</view>
				<view class="flex-box flex-w">
					<view class="label"><text>活动事由</text></view>
					<view class="con flex-w">
						<text>{{getTypeText(info.type)}}</text>
					</view>
				</view>
			</view>
			<view class="flex-box">
				<view class="label"><text>开始时间</text></view>
				<view class="con flex-w">
					<text>{{info.moveStartTime}}</text>
				</view>
			</view>
			<view class="flex-box">
				<view class="label"><text>结束时间</text></view>
				<view class="con flex-w">
					<text>{{info.moveEndTime}}</text>
				</view>
			</view>
			<view class="flex-box">
				<view class="label"><text>起始位置</text></view>
				<view class="con flex-w">
					<text>{{getSelectPath(info.startPosZipCode)}}{{info.startPosAddr}}</text>
				</view>
			</view>
			<view class="flex-box">
				<view class="label"><text>终点位置</text></view>
				<view class="con flex-w">
					<text>{{getSelectPath(info.endPosZipCode)}}{{info.endPosAddr}}</text>
				</view>
			</view>
			<view class="flex-box">
				<view class="label"><text>具体事宜</text></view>
				<view class="con flex-w">
					<text>{{info.note}}</text>
				</view>
			</view>
			<view class="flex-box">
				<view class="label"><text>登记人</text></view>
				<view class="con flex-w">
					<text>{{info.createUserName}}</text>
				</view>
			</view>
			<view class="flex-box">
				<view class="label"><text>登记时间</text></view>
				<view class="con flex-w">
					<text>{{info.createTime&&info.createTime.replace('T','')}}</text>
				</view>
			</view>
			<view class="flex-box" v-if="info.checkStatus=='0'">
				<view class="label"><text>审核不通过原因</text></view>
				<view class="con flex-w">
					<text>{{info.checkReason}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info: {},
				regionData: [],
				type: [{
					"value": "1",
					"text": "车辆维修"
				}, {
					"value": "2",
					"text": "普通运输"
				}, {
					"value": "3",
					"text": "车辆年检"
				}, {
					"value": "4",
					"text": "罐体检验"
				}, {
					"value": "5",
					"text": "车辆保养"
				}, {
					"value": "6",
					"text": "非民用运输"
				},{
						"value": "7",
						"text": "空车运行"
					},{
						"value": "8",
						"text": "其他"
					}],
			};
		},
		methods: {
			getSelectPath(value) {
				if (!value) {
					this.text = ''
					return [];
				}
				var path = [];
				topfor:
					for (let top of this.regionData) {
						if (value.startsWith(top.value)) {
							path[0] = top;
							if (top.children) {
								for (let child of top.children) {
									if (value.startsWith(child.value)) {
										path[1] = child;
										if (child.children) {
											for (let item of child.children) {
												if (item.value == value) {
													path[2] = item;
													break topfor;
												}
											}
										}
									}
								}
							}
						}
					}
				return path.map((item) => {
					return item.title;
				}).join('');
			},
			getTypeText(value) {
				const res = this.type.find(item => item.value === value);
				if (res) {
					return res.text;
				}
				return '';
			},
		},
		onLoad(option) {
			this.regionData = this.$store.getters.getRegionData
			const param = option.param ? JSON.parse(option.param) : {};
			// console.log(param)
			this.info = param;
		}
	}
</script>

<style lang="scss" scoped>
	.detail-box {
		padding: 30rpx 20rpx;

		.text-card {
			>.flex-box {
				border-bottom: 1rpx solid #ddd;
				padding: 0.8em 0;

				&:last-child {
					border-bottom: 0;
				}
			}

			.card-title {
				font-size: 1.1em;
				margin-bottom: 0.5em;
			}
		}

		.flex-box {
			display: flex;
			line-height: 1.1em;

			.flex-w {
				flex: 1;
			}
		}

		.label {
			color: #666;
		}

		.con {
			padding: 0 0.6em;
			font-size: 1.1em;
			word-break: break-all;
		}
	}
</style>
